import Vue from 'vue'
import App from './App.vue'
import Router from 'vue-router'
import router from "./router/index"
import store from './store/index'
import { registerMicroApps, initGlobalState } from 'qiankun';
import { 
  Button, Menu, Icon, Input, Avatar, Popover, Divider, Table, Row, Col, Card, Statistic, List, Badge
} from 'ant-design-vue';

Vue.config.productionTip = false
Vue.use(Router);
Vue.use(Button)
   .use(Menu)
   .use(Icon)
   .use(Input)
   .use(Avatar)
   .use(Popover)
   .use(Divider)
   .use(Table)
   .use(Row)
   .use(Col)
   .use(Card)
   .use(Statistic)
   .use(List)
   .use(Badge)




registerMicroApps([
  {
    name: 'child1', // app name registered
    entry: '//localhost:8085',
    container: '#app-container',
    activeRule: '#/main/childApp1',
    props: {
      appContent: {str: '主应用传的字符串'}
    }
  },
  {
    name: 'child2', // app name registered
    entry: '//localhost:8090',
    container: '#app-container',
    activeRule: '#/main/childApp2',
  },
]);


// 初始化 参数 state，state一定要起名初始化，这里我监听的是closeTab
const actions = initGlobalState({demo: false, value: ''});
actions.onGlobalStateChange((state, prev) => {
  // state: 变更后的状态; prev 变更前的状态
  console.log('main catched change:', state)
  store.commit('setValue', state.value)
  store.commit('setMenuState', state.demo)
});

Vue.prototype.$actions = actions;

new Vue({
  router,
  store,
  render: h => h(App),
}).$mount('#app')

